<template>
    <div>
        <a-card :bordered="false" style="margin-bottom: 10px;">
            <div class="table-page-search-wrapper">
                <a-form :labelCol="labelCol" :wrapperCol="wrapperCol" ref="queryForm">
                    <a-form-item label="应用搜索">
                        <a-input v-model="queryParam.name" placeholder="支持应用名称、字段模糊搜索" allow-clear
                            @keyup.enter.native="handleQuery" />
                    </a-form-item>
                </a-form>
            </div>
        </a-card>
        <a-card :bordered="false" class="table-card">
            <a-table :columns="columns" :data-source="tableData">
                <template slot="operation" slot-scope="text, record">
                    test
                    <!-- <a-popconfirm v-if="dataSource.length" title="Sure to delete?" @confirm="() => onDelete(record.key)">
                        <a href="javascript:;">Delete</a>
                    </a-popconfirm> -->
                </template>
            </a-table>
        </a-card>
    </div>
</template>
<script>
export default {
    name: 'AppStore',
    components: {
    },
    data() {
        return {
            loading: true,
            ids: [],
            labelCol: { span: 2 },
            wrapperCol: { span: 18 },
            queryParam: {
                pageNum: 1,
                pageSize: 10,
                name: null,
            },
            tableData: [],
            columns: [
                {
                    title: '软件名称',
                    dataIndex: 'hostName',
                    ellipsis: true,
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '开发商',
                    dataIndex: 'hostIp',
                    ellipsis: true,
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '说明',
                    dataIndex: 'hostPort',
                    ellipsis: true,
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '价格/天',
                    dataIndex: 'type',
                    scopedSlots: { customRender: 'type' },
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '到期时间',
                    dataIndex: 'status',
                    scopedSlots: { customRender: 'status' },
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '位置',
                    dataIndex: 'remark',
                    ellipsis: true,
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '状态',
                    dataIndex: 'remark',
                    ellipsis: true,
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '首页显示',
                    dataIndex: 'remark',
                    ellipsis: true,
                    align: 'left',
                    width: '15%'
                },
                {
                    title: '操作',
                    dataIndex: 'operation',
                    align: 'center',
                    width: '12%',
                    scopedSlots: { customRender: 'operation' }
                }
            ]
        }
    },
    created() {
    },
    methods: {
    }
}
</script>
  